﻿@model RIS.Models.SearchModel
<div id="searchBar">
    <div class="inner">
        <form id="search" enctype="multipart/form-data" action="http://www.hackathon.vertexarmy.org/search.php" method="post">
            <div class="left" style="width:335px;">
                <h6>Upload your photo</h6>
                <input type="file" name="file" id="file" />
            </div>
            <div class="left"><span style="line-height:100px;color:#727272;font-weight:bold;text-shadow:1px 1px 1px #fff;margin-right:20px;">OR</span></div>
            <div class="left" style="width:335px;">
                <h6>Copy/Paste a link with your photograph:</h6>
                <input type="text" />
            </div>
            <input type="submit" class="orange" value="FIND MY PHOTO"/>
        </form>
        <div class="clear"></div>
    </div>
</div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js" type="text/javascript"></script> 
<script src="http://malsup.github.com/jquery.form.js" type="text/javascript"></script> 
<script type="text/javascript">
    $(document).ready(function () {
        $('#search').ajaxForm(function (msg) {
            $("#nrResults").empty();
            $("#results").empty();
            var stuff = JSON.parse(msg);

            //$("#nrResults").append("We've found " + stuff. + " images");
            for (var i in stuff) {
                var titlu = stuff[i].title;
                var src = stuff[i].data;
                var image_link = stuff[i].image_link;
                var page_link = stuff[i].page_link;

                $("#results").append("<div class='imgResult'><a href='" + image_link + "' title='" + titlu + "'><img src='" + src + "'/></a><span><b>Titlu:&nbsp;</b>" + titlu + " <br/><b>Link:&nbsp;</b>" + image_link + "</span></div>");
                $(".sTitle").show();
            }
        });

    });
</script>
<div class="inner">
    <h2 style="display:none;" class="sTitle">Your search results:</h2>
    <div id="nrResults"></div>
    <div id="results"></div>
</div>
<div class="clear"></div>
